<div class="modal-header">
  <button type="button" class="close" (click)="cancel()">&times;</button>
  <h4 class="modal-title">添加招聘权限</h4>
</div>
<div class="modal-body" modal-body>
    <p-tabView>
      <p-tabPanel header="部门" [selected]="true">
        <div class="row">
          <div class="col-md-6 col-xs-6">
            <div class="form-container container-12">
              <div class="form-item">
                <input type="text" [(ngModel)]="departname" (keyup.enter)="SerchDepart(departname,1)" placeholder="输入查询条件" />
                <!-- <span class="unit qk-btn" (click)="SerchDepart(departname,1)">搜索</span> -->
                <button class="btn btn-orange" (click)="SerchDepart(departname,1)">搜索</button>
              </div>
            </div>
            <p-tree class="tree-self" [value]="departments" selectionMode="multiple" [style]="departmentstyle1" [(selection)]="selectingdepartments"></p-tree>
          </div>
          <!-- (onNodeSelect)="nodeSelect($event)" (onNodeUnselect)="nodeUnselect($event)" -->
          <div class="col-md-1 col-xs-1">
            <div class="ui-picklist-buttons">
              <div class="ui-picklist-buttons-cell">
                <!-- <button icon="fa-angle-right" pbutton="" type="button" class="ui-button ui-widget ui-state-default ui-corner-all ui-button-icon-only"><span class="ui-button-icon-left ui-clickable fa fa-fw fa-angle-right"></span><span class="ui-button-text ui-clickable">ui-btn</span></button> -->
                <button (click)="AddDepartment()" icon="fa-angle-double-right" pbutton="" type="button" class="ui-button ui-widget ui-state-default ui-corner-all ui-button-icon-only">
                  <span class="ui-button-icon-left ui-clickable fa fa-fw fa-angle-double-right"></span>
                  <span class="ui-button-text ui-clickable">ui-btn</span>
                </button>
                <!-- <button icon="fa-angle-left" pbutton="" type="button" class="ui-button ui-widget ui-state-default ui-corner-all ui-button-icon-only"><span class="ui-button-icon-left ui-clickable fa fa-fw fa-angle-left"></span><span class="ui-button-text ui-clickable">ui-btn</span></button> -->
                <button (click)="DelDepartment()" icon="fa-angle-double-left" pbutton="" type="button" class="ui-button ui-widget ui-state-default ui-corner-all ui-button-icon-only">
                  <span class="ui-button-icon-left ui-clickable fa fa-fw fa-angle-double-left"></span>
                  <span class="ui-button-text ui-clickable">ui-btn</span>
                </button>
              </div>
            </div>
          </div>
          <div class="col-md-5 col-xs-5">
            <p-dataTable [value]="selecteddepartments" [(selection)]="selectingdepartments2" selectionMode="multiple" scrollable="true"
              scrollHeight="415px">
              <p-column header="部门">
                <ng-template let-item="rowData" pTemplate="body">
                  <div class="text-left">
                    <span class="ui-treenode-icon fa fa-fw fa-folder"></span>
                    <span>{{item.name}}</span>
                  </div>
                </ng-template>
              </p-column>
              <ng-template pTemplate="emptymessage">
                请选择部门
              </ng-template>
            </p-dataTable>
          </div>
        </div>
        <div class="m-t-5 selected-city">
          <span>所属城市:</span>
          <p-checkbox name="city1" *ngFor="let item of organization.areas" [value]="item" [label]="item.name" [(ngModel)]="selectedcities1"
            (onChange)="checkchange(selectedcities1,item,$event)"></p-checkbox>
        </div>
      </p-tabPanel>
      <p-tabPanel header="个人">
        <div class="row">
          <div class="col-md-6 col-xs-6">
            <div class="form-container container-12">
              <div class="form-item">
                <input type="text" [(ngModel)]="personname" (keyup.enter)="SerchPerson(personname)" placeholder="输入查询条件" />
                <!-- <span class="unit" (click)="SerchPerson(personname)">搜索</span> -->
                <button class="btn btn-orange" (click)="SerchPerson(personname)">搜索</button>
              </div>
            </div>
            <p-tree [value]="persondepartments" selectionMode="single" [style]="departmentstyle2" (onNodeSelect)="GetPerson($event)"
              [(selection)]="selectingdepartment"></p-tree>
            <div style="margin-top:4px">选择人员</div>
            <div class="select-person">
              <p-dataTable [value]="persons" [rows]="10" [paginator]="true" [pageLinks]="5" [rowsPerPageOptions]="[10,20,30]" [(selection)]="selectingpersons"
                selectionMode="multiple" scrollable="true" scrollHeight="120px">
                <p-column field="no" header="员工编号"></p-column>
                <p-column header="姓名">
                  <ng-template let-item="rowData" pTemplate="body">
                    <div class="text-left">
                      <span class="ui-treenode-icon fa fa-fw fa-user"></span>
                      <span>{{item.name}}</span>
                    </div>
                  </ng-template>
                </p-column>
                <ng-template pTemplate="emptymessage">
                  请选择部门
                </ng-template>
              </p-dataTable>
            </div>
          </div>
          <!-- (onNodeSelect)="nodeSelect($event)" (onNodeUnselect)="nodeUnselect($event)" -->
          <div class="col-md-1 col-xs-1">
            <div class="ui-picklist-buttons">
              <div class="ui-picklist-buttons-cell">
                <!-- <button icon="fa-angle-right" pbutton="" type="button" class="ui-button ui-widget ui-state-default ui-corner-all ui-button-icon-only"><span class="ui-button-icon-left ui-clickable fa fa-fw fa-angle-right"></span><span class="ui-button-text ui-clickable">ui-btn</span></button> -->
                <button (click)="AddPerson()" icon="fa-angle-double-right" pbutton="" type="button" class="ui-button ui-widget ui-state-default ui-corner-all ui-button-icon-only">
                  <span class="ui-button-icon-left ui-clickable fa fa-fw fa-angle-double-right"></span>
                  <span class="ui-button-text ui-clickable">ui-btn</span>
                </button>
                <!-- <button icon="fa-angle-left" pbutton="" type="button" class="ui-button ui-widget ui-state-default ui-corner-all ui-button-icon-only"><span class="ui-button-icon-left ui-clickable fa fa-fw fa-angle-left"></span><span class="ui-button-text ui-clickable">ui-btn</span></button> -->
                <button (click)="DelPerson()" icon="fa-angle-double-left" pbutton="" type="button" class="ui-button ui-widget ui-state-default ui-corner-all ui-button-icon-only">
                  <span class="ui-button-icon-left ui-clickable fa fa-fw fa-angle-double-left"></span>
                  <span class="ui-button-text ui-clickable">ui-btn</span>
                </button>
              </div>
            </div>
          </div>
          <div class="col-md-5 col-xs-5 select-list-self">
            <p-dataTable [value]="selecteddepersons" [(selection)]="selectingpersons2" selectionMode="multiple" scrollable="true" scrollHeight="380px">
              <p-column field="no" header="员工编号"></p-column>
              <p-column header="姓名">
                <ng-template let-item="rowData" pTemplate="body">
                  <div class="text-left">
                    <span class="ui-treenode-icon fa fa-fw fa-user"></span>
                    <span>{{item.name}}</span>
                  </div>
                </ng-template>
              </p-column>
              <ng-template pTemplate="emptymessage">
                请选择人员
              </ng-template>
            </p-dataTable>
          </div>
        </div>
        <div class="m-t-5 selected-city">
          <span>所属城市:</span>
          <p-checkbox name="city2" *ngFor="let item of organization.areas" [value]="item" [label]="item.name" [(ngModel)]="selectedcities2"
            (onChange)="checkchange(selectedcities2,item,$event)"></p-checkbox>
        </div>
      </p-tabPanel>
    </p-tabView>
</div>
<div class="modal-footer">
  <button class="btn btn-cancel" (click)="cancel()">取消</button>
  <button class="btn btn-success" (click)="save()">保存</button>
</div>